<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE-edge">
<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="css/index.css">
<title>汇智网上书店</title>
</head>
<body ng-app="app-index" ng-controller="ctl-index">
	<nav class="navbar navbar-inverse navbar-fixed-top">
		<div class="container">
			<div class="navbar-header">
				<button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="#">汇智网上书店</a>
			</div>
			<div class="navbar-collapse collapse">
				<ul class="nav navbar-nav navbar-right">
					<li ng-hide="unLogin"><a data-toggle="modal" data-target="#modalLogin">你好，请登录</a></li>
					<li ng-hide="loginIn"><a>你好，{{sessionName}}</a></li>
					<li ng-hide="register"><a href="html/register.html">注册</a></li>
					<li ng-hide="logout"><a id="aLogOut" ng-click="clikLogout()">退出</a></li>
				</ul>
				<form class="navbar-form navbar-left">
					<div class="input-group">
						<span class="input-group-addon">
							<input type="radio" name="iptSearchType" value="1">
							作者
							<input type="radio" name="iptSearchType" value="2">
							书名
							<input type="radio" name="iptSearchType" value="3">
							出版社
						</span>
						<input type="text" class="form-control" placeholder="搜索">
						<span class="input-group-btn">
							<button class="btn btn-default" type="submit">
								<span class="glyphicon glyphicon-search"></span>
							</button>
						</span>
					</div>
				</form>
			</div>
		</div>
	</nav>
	<div class="container content">
		<div class="row">
			<div class="col-xs-3 best-selling">
				<div class="panel panel-default">
					<div class="panel-heading">销量排行榜</div>
					<ul class="list-group">
						<li class="list-group-item" ng-repeat="book in booksBestSelling"><img alt="" src={{"/images/"+book.bookPicture}}>
							<ul class="list-unstyled">
								<li>{{book.bookName}}</li>
								<li>{{"作者："+book.bookAuthor}}</li>
							</ul></li>
					</ul>
				</div>
			</div>
			<div class="col-xs-9 main">
				<div class="panel panel-default">
					<div class="panel-heading">最新上架</div>
					<div class="panel-body">
						<div class="col-xs-6" ng-repeat="book in booksLatest">
							<img alt="" src={{"/images/"+book.bookPicture}}>
							<ul class="list-unstyled">
								<li>{{book.bookName}}</li>
								<li>{{"作者："+book.bookAuthor}}</li>
								<li>{{"出版社："+ book.bookPress}}</li>
								<li>{{"类型："+ book.type.typeName}}</li>
							</ul>
						</div>
					</div>
				</div>
				<div class="panel panel-default">
					<div class="panel-heading">特价热销</div>
					<div class="panel-body">
						<div class="col-xs-6" ng-repeat="book in booksBargain">
							<img alt="" src={{"/images/"+book.bookPicture}}>
							<ul class="list-unstyled">
								<li>{{book.bookName}}</li>
								<li>{{"作者："+book.bookAuthor}}</li>
								<li>{{"出版社："+ book.bookPress}}</li>
								<li>{{"类型："+ book.type.typeName}}</li>
							</ul>
						</div>
					</div>
				</div>
				<div class="panel panel-default">
					<div class="panel-heading">友情推荐</div>
					<div class="panel-body">
						<div class="col-xs-6" ng-repeat="book in booksRecommended">
							<img alt="" src={{"/images/"+book.bookPicture}}>
							<ul class="list-unstyled">
								<li>{{book.bookName}}</li>
								<li>{{"作者："+book.bookAuthor}}</li>
								<li>{{"出版社："+ book.bookPress}}</li>
								<li>{{"类型："+ book.type.typeName}}</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="modalLogin" class="modal fade" tabindex="-1" role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title">用户登录</h4>
				</div>
				<div class="modal-body">
					<form id="fmLogin">
						<div class="form-group" ng-hide="logFail">
							<div class="input-group" id="divFail" >
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-minus-sign" aria-hidden="true"></span>
								</div>
								<div class="form-control" style="color: #8a6d3b; background-color: #fcf8e3; border-color: #faebcc;" id="divFailMsg">{{logFailMsg}}</div>
							</div>
						</div>
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-user" aria-hidden="true"></span>
								</div>
								<input type="text" class="form-control" name="username" ng-model="username" placeholder="请输入使用6-16位英文字母或数字，且以字母开头！" pattern="^[a-zA-Z][a-zA-Z0-9]{5,15}$" autofocus required>
							</div>
						</div>
						<div class="form-group">
							<div class="input-group">
								<div class="input-group-addon">
									<span class="glyphicon glyphicon-lock" aria-hidden="true"></span>
								</div>
								<input type="password" class="form-control" name="password" ng-model="password" placeholder="请输入6-12位英文字母或数字！" pattern="^[a-zA-Z0-9]{6,12}" required>
							</div>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button id="btnLogin" type="submit" form="fmLogin" class="btn btn-primary" ng-click="loginSubmit()">登录</button>
				</div>
			</div>
		</div>
	</div>
	<footer>
		<div class="container">
			<div class="row">
				<div class="col-md-12">
					<p>Copyrights Reserved 2005-2010 窗内网(www.itzcn.com) 豫 ICP08104500号</p>
				</div>
			</div>
		</div>
	</footer>
	<script type="text/javascript" src="lib/jquery-3.2.1.min.js"></script>
	<script type="text/javascript" src="lib/bootstrap/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
	<script type="text/javascript" src="js/index.js"></script>
</body>
</html>